<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<tr:document xmlns="http://www.w3.org/1999/xhtml"
             xmlns:ui="http://java.sun.com/jsf/facelets"
             xmlns:h="http://java.sun.com/jsf/html"
             xmlns:f="http://java.sun.com/jsf/core"
             xmlns:mias="http://www.monsters.inc/mias"
             xmlns:tr="http://myfaces.apache.org/trinidad"
             xmlns:c="http://java.sun.com/jstl/core">

<ui:composition template="templates/template.xhtml">
  <ui:define name="title">Layout test page</ui:define>
  <ui:define name="content">
  
  <tr:panelSideBar width="150px">
      <tr:panelList inlineStyle="margin-botom: 10px;">
        <tr:goLink text="Main website" destination="http://myfaces.apache.org"/>
        <tr:goLink text="Wiki" destination="http://wiki.apache.org/myfaces/"/>
        <tr:goLink text="Sources" destination="http://svn.apache.org/viewvc/myfaces/site/trunk/"/>
        <tr:goLink text="Issue tracking" destination="https://issues.apache.org/jira/secure/BrowseProjects.jspa"/>
      </tr:panelList>
  </tr:panelSideBar>
  
  <tr:selectBooleanCheckbox id="checkBox" autoSubmit="true" partialSubmit="true" label="Show warning" selected="true"/>
  <tr:panelGroupLayout partialTriggers="checkBox">
    <tr:panelBox rendered="#{checkBox.selected}" icon="../images/exclamation.png" text="Warning!" background="#{bg}" inlineStyle="width:500px;">
      <tr:outputFormatted value="You should be aware that a lot of &lt;b&gt;monsters&lt;/b&gt; work at this scaring facility. It is their job to scare kids in order to collect their screams. People with (a history of) heart problems are advised not to get scared. Please read our &lt;a href='#'&gt;disclaimer&lt;/a&gt; for information about reliability."/>
    </tr:panelBox>
  </tr:panelGroupLayout>
  <tr:outputText value="Value = #{checkBox.selected}" partialTriggers="checkBox"/>
  
  <!-- tr:panelChoice label="Links to..." position="top" alignment="center"-->
  <tr:panelRadio label="Links to..." position="top" alignment="center">
    <tr:showDetailItem text="Apache MyFaces websites">
      <tr:panelList inlineStyle="margin-botom: 10px;">
        <tr:goLink text="Main website" destination="http://myfaces.apache.org"/>
        <tr:goLink text="Wiki" destination="http://wiki.apache.org/myfaces/"/>
        <tr:goLink text="Sources" destination="http://svn.apache.org/viewvc/myfaces/site/trunk/"/>
        <tr:goLink text="Issue tracking" destination="https://issues.apache.org/jira/secure/BrowseProjects.jspa"/>
      </tr:panelList>
    </tr:showDetailItem>
    <tr:showDetailItem text="Apache MyFaces Trinidad useful links">
      <tr:panelList inlineStyle="margin-botom: 10px;">
        <tr:goLink text="Main website" destination="http://myfaces.apache.org/trinidad"/>
        <tr:goLink text="Developers guide" destination="http://myfaces.apache.org/trinidad/devguide/index.html"/>
        <tr:goLink text="Tag documentation" destination="http://myfaces.apache.org/trinidad/trinidad-1_2/trinidad-api/tagdoc.html"/>
        <tr:goLink text="JavaDocs" destination="http://myfaces.apache.org/trinidad/trinidad-1_2/trinidad-api/testapidocs/index.html"/>
      </tr:panelList>
    </tr:showDetailItem>
    <tr:showDetailItem text="Book resources">
      <tr:panelList inlineStyle="margin-botom: 10px;">
        <tr:goLink text="Packt publishing" destination="http://www.packtpub.com/"/>
        <tr:goLink text="Example sources" destination="http://code.google.com/p/jee-examples/"/>
        <tr:goLink text="Author's weblog" destination="http://www.bartkummel.net"/>
      </tr:panelList>
    </tr:showDetailItem>
    <tr:showDetailItem text="Other stuff">
      <tr:panelList inlineStyle="margin-botom: 10px;">
        <tr:goLink text="Google" destination="http://www.google.com"/>
        <tr:goLink text="Delicious" destination="http://del.icio.us"/>
        <tr:goLink text="JavaRanch" destination="http://www.javaranch.com"/>
      </tr:panelList>
    </tr:showDetailItem>
  </tr:panelRadio>


  <tr:panelChoice labelAndAccessKey="Background color scheme:" position="top" alignment="end">
    <c:forEach var="bg" items="#{mias:getStringArray('light medium dark transparent')}">
      <tr:showDetailItem text="#{bg}">
        <tr:panelBox icon="../images/exclamation.png" text="Warning!" background="#{bg}" inlineStyle="width:500px;">
          <tr:outputFormatted value="You should be aware that a lot of &lt;b&gt;monsters&lt;/b&gt; work at this scaring facility. It is their job to scare kids in order to collect their screams. People with (a history of) heart problems are advised not to get scared. Please read our &lt;a href='#'&gt;disclaimer&lt;/a&gt; for information about reliability."/>
        </tr:panelBox>
      </tr:showDetailItem>
    </c:forEach>
  </tr:panelChoice>
  
  <tr:panelGroupLayout layout="vertical"> <!--inlineStyle="width:200px;"-->
    <tr:panelButtonBar>
      <tr:group>
        <tr:commandButton text="button 1" />
        <tr:commandButton text="button 2" />
      </tr:group>
      <tr:commandButton text="button 3" />
      <tr:commandButton text="button 4" />
      <tr:commandButton text="button 5" />
      <tr:commandButton text="button 6" />
      <f:facet name="separator">&#8226;</f:facet>
    </tr:panelButtonBar>
    <tr:panelGroupLayout layout="horizontal">
      <tr:group>
        <tr:commandButton text="button 1" />
        <tr:commandButton text="button 2" />
      </tr:group>
      <tr:commandButton text="button 3" />
      <tr:commandButton text="button 4" />
      <tr:commandButton text="button 5" />
      <tr:commandButton text="button 6" />
      <f:facet name="separator">&#8226;</f:facet>
    </tr:panelGroupLayout>
  </tr:panelGroupLayout>

  <tr:panelPopup text="More information" title="Websites related to this book">
    <tr:panelGroupLayout layout="vertical">
      <tr:goLink text="Packt publishing" destination="http://www.packtpub.com/"/>
      <tr:goLink text="Example sources" destination="http://code.google.com/p/jee-examples/"/>
      <tr:goLink text="Author's weblog" destination="http://www.bartkummel.net"/>
    </tr:panelGroupLayout>
  </tr:panelPopup>

  <tr:outputText value="" />

  <c:forEach var="msgType" items="#{mias:getStringArray('information warning error confirmation')}">
    <tr:panelHeader messageType="#{msgType}" text="System temporary out of order" >
      <tr:outputText value="The system is temporary out of order due to planned maintenance. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi mattis tempus ligula. Curabitur quis eros. Nunc ligula. Cras magna mi, pellentesque vel, imperdiet id, dictum ut, nulla. Curabitur iaculis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed adipiscing. Fusce eleifend hendrerit odio. Duis vulputate mauris non nunc. Sed vitae dolor ac dolor facilisis ornare. Nullam tempus tempor purus. Sed sed ipsum non augue eleifend pretium. Etiam libero diam, bibendum a, convallis sit amet, interdum sed, nibh. Vestibulum luctus ipsum vitae elit. "/>
      <tr:panelHeader text="Who to contact">
        <tr:outputText value="Please contact the system administrator for more information. Nullam aliquam, ligula ac condimentum porttitor, odio leo pharetra sapien, sit amet tempor libero tortor at est. Donec eleifend luctus dui. Suspendisse urna dolor, venenatis non, eleifend ut, ultrices non, erat. Vestibulum tempor libero a metus. In hac habitasse platea dictumst. Duis adipiscing sem ut odio. Quisque vel tellus. Nullam lectus erat, scelerisque at, rutrum sed, malesuada eu, sem. Quisque non tortor. Nullam nulla lectus, euismod ut, faucibus vel, interdum ac, neque. Aliquam purus arcu, lacinia eget, aliquam nec, porttitor eu, lacus. Quisque dui. Sed mi leo, pellentesque vel, laoreet ac, lacinia in, neque. Donec ut odio bibendum lacus ultrices cursus. Nulla mattis risus ut velit. Aliquam viverra, massa ac fermentum iaculis, neque leo consectetur ligula, ac vehicula erat tortor a sapien. Integer vel elit. "/>
      </tr:panelHeader>
    </tr:panelHeader>
  </c:forEach>

  <tr:panelHeader text="System temporary out of order" icon="../images/error.png">
    <tr:outputText value="The system is temporary out of order due to planned maintenance. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi mattis tempus ligula. Curabitur quis eros. Nunc ligula. Cras magna mi, pellentesque vel, imperdiet id, dictum ut, nulla. Curabitur iaculis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed adipiscing. Fusce eleifend hendrerit odio. Duis vulputate mauris non nunc. Sed vitae dolor ac dolor facilisis ornare. Nullam tempus tempor purus. Sed sed ipsum non augue eleifend pretium. Etiam libero diam, bibendum a, convallis sit amet, interdum sed, nibh. Vestibulum luctus ipsum vitae elit. "/>
    <tr:panelHeader text="Who to contact">
      <tr:outputText value="Please contact the system administrator for more information. Nullam aliquam, ligula ac condimentum porttitor, odio leo pharetra sapien, sit amet tempor libero tortor at est. Donec eleifend luctus dui. Suspendisse urna dolor, venenatis non, eleifend ut, ultrices non, erat. Vestibulum tempor libero a metus. In hac habitasse platea dictumst. Duis adipiscing sem ut odio. Quisque vel tellus. Nullam lectus erat, scelerisque at, rutrum sed, malesuada eu, sem. Quisque non tortor. Nullam nulla lectus, euismod ut, faucibus vel, interdum ac, neque. Aliquam purus arcu, lacinia eget, aliquam nec, porttitor eu, lacus. Quisque dui. Sed mi leo, pellentesque vel, laoreet ac, lacinia in, neque. Donec ut odio bibendum lacus ultrices cursus. Nulla mattis risus ut velit. Aliquam viverra, massa ac fermentum iaculis, neque leo consectetur ligula, ac vehicula erat tortor a sapien. Integer vel elit. "/>
    </tr:panelHeader>
  </tr:panelHeader>

  
  <c:forEach var="bg" items="#{mias:getStringArray('light medium dark transparent')}">
    <tr:panelBox icon="../images/exclamation.png" text="Warning!" background="#{bg}" inlineStyle="width:500px;">
      <tr:outputFormatted value="You should be aware that a lot of &lt;b&gt;monsters&lt;/b&gt; work at this scaring facility. It is their job to scare kids in order to collect their screams. People with (a history of) heart problems are advised not to get scared. Please read our &lt;a href='#'&gt;disclaimer&lt;/a&gt; for information about reliability."/>
    </tr:panelBox>
  </c:forEach>
  
<!--   <tr:panelAccordion discloseMany="false" discloseNone="true">-->
  <tr:panelTabbed position="above">
    <tr:showDetailItem text="Apache MyFaces websites">
      <tr:panelGroupLayout layout="vertical" ><!-- inlineStyle="margin-left: 17px; margin-bottom: 5px;"-->
        <tr:goLink text="Main website" destination="http://myfaces.apache.org"/>
	    <tr:goLink text="Wiki" destination="http://wiki.apache.org/myfaces/"/>
	    <tr:goLink text="Sources" destination="http://svn.apache.org/viewvc/myfaces/site/trunk/"/>
	    <tr:goLink text="Issue tracking" destination="https://issues.apache.org/jira/secure/BrowseProjects.jspa"/>
	  </tr:panelGroupLayout>
    </tr:showDetailItem>
    <tr:showDetailItem text="Apache MyFaces Trinidad useful links">
      <tr:panelGroupLayout layout="vertical" ><!-- inlineStyle="margin-left: 17px; margin-bottom: 5px;"-->
        <tr:goLink text="Main website" destination="http://myfaces.apache.org/trinidad"/>
        <tr:goLink text="Developers guide" destination="http://myfaces.apache.org/trinidad/devguide/index.html"/>
        <tr:goLink text="Tag documentation" destination="http://myfaces.apache.org/trinidad/trinidad-1_2/trinidad-api/tagdoc.html"/>
        <tr:goLink text="JavaDocs" destination="http://myfaces.apache.org/trinidad/trinidad-1_2/trinidad-api/testapidocs/index.html"/>
      </tr:panelGroupLayout>
    </tr:showDetailItem>
    <tr:showDetailItem text="Book resources">
      <tr:panelGroupLayout layout="vertical" ><!-- inlineStyle="margin-left: 17px; margin-bottom: 5px;"-->
        <tr:goLink text="Packt publishing" destination="http://www.packtpub.com/"/>
        <tr:goLink text="Example sources" destination="http://code.google.com/p/jee-examples/"/>
        <tr:goLink text="Author's weblog" destination="http://www.bartkummel.net"/>
      </tr:panelGroupLayout>
    </tr:showDetailItem>
    <tr:showDetailItem text="Other stuff">
      <tr:panelGroupLayout layout="vertical" ><!-- inlineStyle="margin-left: 17px; margin-bottom: 5px;"-->
        <tr:goLink text="Google" destination="http://www.google.com"/>
        <tr:goLink text="Delicious" destination="http://del.icio.us"/>
        <tr:goLink text="JavaRanch" destination="http://www.javaranch.com"/>
      </tr:panelGroupLayout>
    </tr:showDetailItem>
  </tr:panelTabbed>
  <!-- </tr:panelAccordion>-->
  
  
  
  <tr:panelHorizontalLayout valign="top" halign="end">
    <f:facet name="separator">
      <tr:spacer width="10" height="1"/>
    </f:facet>
    <tr:goLink text="Apache Trinidad 1"
               destination="http://myfaces.apache.org"/>
    <tr:goLink text="Apache Trinidad 2"
               destination="http://myfaces.apache.org"/>
    <tr:goLink text="Apache Trinidad 3"
               destination="http://myfaces.apache.org"/>
  </tr:panelHorizontalLayout>

  <tr:panelGroupLayout layout="vertical" inlineStyle="width:200px;">
    <tr:panelGroupLayout layout="horizontal">
      <tr:group>
        <tr:commandButton text="button 1" />
        <tr:commandButton text="button 2" />
      </tr:group>
      <tr:commandButton text="button 3" />
      <tr:commandButton text="button 4" />
      <f:facet name="separator">&#8226;</f:facet>
    </tr:panelGroupLayout>

    <tr:panelGroupLayout layout="vertical">
      <tr:group>
        <tr:commandButton text="button 1" />
        <tr:commandButton text="button 2" />
      </tr:group>
      <tr:commandButton text="button 3" />
      <tr:commandButton text="button 4" />
      <f:facet name="separator">&#8226;</f:facet>
    </tr:panelGroupLayout>

    <tr:panelGroupLayout layout="default">
      <tr:group>
        <tr:commandButton text="button 1" />
        <tr:commandButton text="button 2" />
      </tr:group>
      <tr:commandButton text="button 3" />
      <tr:commandButton text="button 4" />
      <f:facet name="separator">&#8226;</f:facet>
    </tr:panelGroupLayout>
    
    <f:facet name="separator"><br/>
    </f:facet>
  </tr:panelGroupLayout>
  
    <tr:panelBorderLayout inlineStyle="width:300px;" layout="expand">
      <f:facet name="bottom"><tr:panelBox inlineStyle="width:100%; height=100%">bottom</tr:panelBox></f:facet>
      <f:facet name="innerBottom"><tr:panelBox inlineStyle="width:100%; height=100%">innerBottom</tr:panelBox></f:facet>
      <f:facet name="innerLeft"><tr:panelBox inlineStyle="width:100%; height=100%">innerLeft</tr:panelBox></f:facet>
      <f:facet name="innerRight"><tr:panelBox inlineStyle="width:100%; height=100%">innerRight</tr:panelBox></f:facet>
      <f:facet name="innerTop"><tr:panelBox inlineStyle="width:100%; height=100%">innerTop</tr:panelBox></f:facet>
      <f:facet name="left"><tr:panelBox inlineStyle="width:100%; height=100%">left</tr:panelBox></f:facet>
      <f:facet name="right"><tr:panelBox inlineStyle="width:100%; height=100%">right</tr:panelBox></f:facet>
      <f:facet name="top"><tr:panelBox inlineStyle="width:100%; height=100%">top</tr:panelBox></f:facet>
      <tr:panelBox>child</tr:panelBox>
    </tr:panelBorderLayout> 
  </ui:define>
</ui:composition>

</tr:document>